<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>门诊明细记录</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">

    <link rel="icon" href="../../img/web/web.ico"/>
    <link rel="stylesheet" href="../../layui/css/layui.css"/>
    <link rel="stylesheet" href="../../css/app.css"/>
<body ontouchstart="">

<div class="layui-fluid">
    <div class="layui-row layui-col-space15">

        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header">门诊明细记录</div>
                <div class="layui-card-body">

                    <!-- 表格工具栏 -->
                    <div class="layui-row vip-btn-tool-box">
                        <!--<div class="layui-col-sm12 layui-col-sm4 layui-col-md4 layui-btn-container">
                            <button class="layui-btn layui-btn-radius layui-btn-primary" id="vip-btn-add" title="新增"><i class="vip-icon">&#xe65c;</i></button>
                            <button class="layui-btn layui-btn-radius layui-btn-primary" id="vip-btn-del" title="删除"><i class="vip-icon">&#xe664;</i></button>
                            <button class="layui-btn layui-btn-radius layui-btn-primary" id="vip-btn-refresh" title="刷新"><i class="vip-icon">&#xe68a;</i></button>
                        </div>-->
                        <div class="layui-col-sm12 layui-col-sm12 layui-col-md12">
                            <form class="layui-form layui-form-pane">
                            	<div class="layui-col-sm12 layui-col-sm12 layui-col-md12">
                                <div class="layui-form-item">
                                    <label class="layui-form-label layui-label-sm">统计日期</label>
                                    <div class="layui-input-inline layui-input-sm">
                                    	<input type="text" value="2019-03-01" name="date" id="date1" autocomplete="off" class="layui-input">
<!--                                        <input type="text" value="2019-03-01" name="search" required="" lay-verify="required" lay-vertype="tips" placeholder="请输入内容" autocomplete="off" class="layui-input" data-form-pw="1515934826270.1904">
-->                                    </div>
                                    <label class="layui-form-label layui-label-sm">科室</label>
                                    <div class="layui-input-inline layui-input-sm">
                                        <select name="select">
                                            <option value="">全部</option>
                                            <option value="1" selected="">内科</option>
                                            <option value="2">外科</option>
                                            <option value="3">中医科</option>
                                            <option value="4">中医骨科</option>
                                            <option value="4">中医理疗</option>
                                            <option value="4">中医疼痛</option>
                                        </select>
                                    </div>
                                    <label class="layui-form-label layui-label-sm">医生</label>
                                    <div class="layui-input-inline layui-input-sm">
                                        <select name="select">
                                            <option value="">全部</option>
                                            <option value="1" selected="">郭素生</option>
                                            <option value="2">孟祥军</option>
                                            <option value="3">徐彩凤</option>
                                            <option value="4">张春梅</option>
                                        </select>
                                    </div>
                                    <label class="layui-form-label layui-label-sm">类型</label>
                                    <div class="layui-input-inline layui-input-sm">
                                        <select name="select">
                                            <option value="">全部</option>
                                            <option value="1" selected="">医保</option>
                                            <option value="3">自费</option>
                                        </select>
                                    </div>
                                    </div>
                                    <div class="layui-col-sm12 layui-col-sm12 layui-col-md12">
                                    <label class="layui-form-label layui-label-sm">初复诊</label>
                                    <div class="layui-input-inline layui-input-sm">
                                        <select name="select">
                                            <option value="">全部</option>
                                            <option value="1" selected="">复诊</option>
                                            <option value="2">初诊</option>
                                        </select>
                                    </div>
                                    <button id="vip-btn-search" type="button" class="layui-btn layui-btn-radius layui-btn-primary" title="搜索">搜索</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                    </br>

                    <div id="demo-table-2" lay-filter="table"></div>
                </div>
            </div>
        </div>

    </div>
</div>
<script type="text/javascript" src="../../layui/layui.js"></script>
<script type="text/javascript">
layui.config({base: '../../js/'}).use(['layer','table','form','laydate','app'],function(){
    var $ = layui.$, layer = layui.layer, table = layui.table, form = layui.form, app = layui.app,laydate = layui.laydate;
 //日期
    laydate.render({
        elem: '#date1'
    });
    // 表格
    var table2 = table.render({
        elem: '#demo-table-2'
        ,id: 'table-id-2'
        ,url: '../../json/demo-table-1.json'   // 数据接口
        ,page: true                         // 开启分页
        ,loading: true                      // 开启loading
        ,cellMinWidth: 80                   // 每列最小宽度
        ,limits: [15,30,50]                 // 每页条数的选择项
        ,limit: 15                          // 默认每页条数
        ,totalRow: true
//    ,toolbar: 'default'                 // 开启表格头部工具栏区域 该参数为 layui 2.4.0 开始新增。
        ,defaultToolbar: ['exports', 'filter'] // 自由配置头部工具栏右侧的图标 该参数为 layui 2.4.1 新增
        ,cols: [[                           // 表头
            {field: 'id', title: 'ID', sort: true, totalRowText: '合计'}
            ,{field: 'departmentName', title: '科室'}
            ,{field: 'doctor', title: '医生'}
            ,{field: 'medicalstyle', title: '类型'}
            ,{field: 'patient', title: '病人'}
            ,{field: 'firstVisit', title: '初复诊'}
            ,{field: 'westernMedicine', title: '西药', totalRow: true}
            ,{field: 'dentalImplantFee', title: '镶牙费', totalRow: true}
            ,{field: 'medicalFee', title: '诊疗费', totalRow: true}
            ,{field: 'treatmentFee', title: '治疗费', totalRow: true}
            ,{field: 'chineseHerbalMedicine', title: '中草药', totalRow: true}
            ,{field: 'chinesePatentMedicine', title: '中成药', totalRow: true}
            ,{field: 'acupunctureMoxibustion', title: '针刺灸法', totalRow: true}
            ,{field: 'chineseMassage', title: '中医推拿', totalRow: true}
            ,{field: 'radiologicalFee', title: '放射费', totalRow: true}
            ,{field: 'nuclearMagneticCharges', title: '核磁费', totalRow: true}
            ,{field: 'nursingRoutine', title: '护理常规', totalRow: true}
            ,{field: 'nursingCost', title: '护理费', totalRow: true}
            ,{field: 'oxygenCharge', title: '输氧费', totalRow: true}
            ,{field: 'operationFee', title: '手术费', totalRow: true}
            ,{field: 'inspectionFee', title: '检查费', totalRow: true}
            ,{field: 'anesthesiaCost', title: '麻醉费', totalRow: true}
            ,{field: 'bultrasoundFee', title: 'B超费', totalRow: true}
            ,{field: 'ctFee', title: 'CT费', totalRow: true}
            ,{field: 'materialCost', title: '材料费', totalRow: true}
            ,{field: 'bedFee', title: '床位费', totalRow: true}
            ,{field: 'otherFee', title: '其它', totalRow: true}
            ,{field: 'addTime', title: '统计日期',width:120}
             ,{field: 'total', fixed: 'right',align:'center',title: '总计', totalRow: true}
        ]]
    });

    // 监听新增按钮
    $('#vip-btn-add').on('click',function(){
        app.msg('点击了新增按钮');
    });

    // 监听多选删除按钮
    $('#vip-btn-del').on('click',function(){
        var checkStatus = table.checkStatus('table-id-2'); // table-id-2 即为基础参数id对应的值

        if(!checkStatus.data.length){
            app.msg('未选中数据');
            return false;
        }

        if(checkStatus.isAll){
            app.msg('全选了:'+ app.getIds(checkStatus.data) );
        }else{
            app.msg( app.getIds(checkStatus.data) );
        }

        console.log(checkStatus.data);
        //console.log(checkStatus.data);        //获取选中行的数据
        //console.log(checkStatus.data.length); //获取选中行数量，可作为是否有选中行的条件
        //console.log(checkStatus.isAll );      //表格是否全选
    });

    // 监听表格刷新
    $('#vip-btn-refresh').on('click',function(){
        // 重载方式 1
        table2.reload();
        // 重载方式 2
        // table.reload('table-id-2', {})
    });

    // 监听搜索按钮
    $(document).on('click','#vip-btn-search',function(){
//      var title = $('input[name=search]').val();
        var select = $('select[name=select]').val();
//      if(!title){
//          app.msg('搜索不能为空');
//          return false;
//      }
//
//      layer.alert('标题：'+title+';选择：'+select);
    });

    //监听工具条
    table.on('tool(table)', function(obj){
        var data = obj.data;            //获得当前行数据
        var layEvent = obj.event;       //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
        var tr = obj.tr;                //获得当前行 tr 的DOM对象

        if(layEvent === 'view'){ // 查看

            app.msg('您点击了查看');
            // do somehing

        }
    });
});
</script>
</body>
</html>